import axios from 'axios'
import store from '@/store'
import { Message } from 'element-ui'
const service = axios.create({
  // 最好不要删除，因为它会根据运行的命令来决定加载那个环境变量
  // 开发基地址：一个，上线的线上基地址是另一个
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 5000
})

service.interceptors.request.use(
  config => {
    // 统一携带token
    const token = store.getters.token
    if (token) {
      config.headers.Authorization = `Bearer ${token}`
    }
    return config
  },
  error => {
    return Promise.reject(error)
  }
)

service.interceptors.response.use(// 对响应做写什么(但是什么都不写默认)
  response => { // 默认2xx, 3xx开头的http响应状态码进入这里-返回成功 (axios响应对象reponse)
    // 后台返回接口2种
    // http状态码来决定成功/失败 -> 黑马头条项目
    // 返回数据里某个字段(code/success)决定本次接口是成功/失败 -> 人资项目
    const { success, message } = response.data// 把后台返回的数据对象,结构赋值
    if (success) return response.data // 直接把后台返回的数据对象返回到axios请求的地方
    else {
      // 这里还是不能使用this.$message
      // 可以从element-ui包里导出
      Message.error(message) // 统一提示(必须提示), 成功可以在外面自行决定是否提示.成功数据外面也要使用
      return Promise.reject(message)// 返回Promise失败对象(内部错误提示文字)
    }
  },
  error => {
    // if (error.response.status === 401)
    // if (error && error.response && error.response.data && error.response.data.code === 10002)
    // 简化写法-需要babel支持     // 10002的code是我与后台约定好的
    Message.error(error)
    if (error?.response?.data?.code === 10002) {
      store.dispatch('app/closeSideBar', { withoutAnimation: false })
      // 被动退出
      store.dispatch('user/logoutActions')
    }
    return Promise.reject(error)
  }
)

export default service
